﻿<UserControl x:Class="Bricks.BaseFramework.GenericControls.ButtonList"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="60" d:DesignWidth="400"
             Loaded="UserControl_Loaded">
    <UserControl.Resources>
        <!--<local:NullOrWhiteSpaceToVisibleConverter x:Key="nullOrWhiteSpaceToVisibleConverter" />-->
        <!--<local:DoubleToVisibilityConvert x:Key="doubleToVisibilityConvert" />-->
        <Style TargetType="{x:Type Button}" x:Key="perStyle">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Focusable" Value="False" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <Image Source="{Binding Path=Per_Default}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Button}">
                                <Grid>
                                    <Image Source="{Binding Path=Per_IsMouseOver}"/>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Trigger>
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Button}">
                                <Grid>
                                    <Image Source="{Binding Path=Per_IsPressed}"/>
                                    <!--/Assistant;component/Images/Setting.png-->
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
        <Style TargetType="{x:Type Button}" x:Key="nextStyle">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Focusable" Value="False" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <Image Source="{Binding Path=Next_Default}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Button}">
                                <Grid>
                                    <Image Source="{Binding Path=Next_IsMouseOver}"/>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Trigger>
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type Button}">
                                <Grid>
                                    <Image Source="{Binding Path=Next_IsPressed}"/>
                                    <!--/Assistant;component/Images/Setting.png-->
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
        <Style TargetType="{x:Type Button}" x:Key="navButton">
            <Setter Property="OverridesDefaultStyle" Value="True" />
            <Setter Property="Focusable" Value="False" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Name="borderButton" Margin="4,2" CornerRadius="3" Padding="0" BorderThickness="1" Background="{TemplateBinding Button.Background}" OpacityMask="#F0FFFFFF">
                            <!--Background="{TemplateBinding Button.Background}"-->
                            <!--/Assistant;component/Images/AllInfo.png-->
                            <!--此处绑定Button的DataContext为按钮的图片-->
                            <Image Source="{TemplateBinding Button.DataContext}" HorizontalAlignment="Center" VerticalAlignment="Center" />
                            <!--此处绑定Button的Content为按钮图片下的文字-->
                            <!--<TextBlock Text="{TemplateBinding Button.Content}" Visibility="{TemplateBinding Button.Content,Converter={StaticResource nullOrWhiteSpaceToVisibleConverter}}" Foreground="WhiteSmoke" HorizontalAlignment="Center" />-->
                            <!--<Border.Background>
                                <RadialGradientBrush>
                                    <GradientStop Color="#64F0F8FF" Offset="0" />
                                    <GradientStop Color="#64FFFFFF" Offset="1" />
                                </RadialGradientBrush>
                            </Border.Background>-->
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="borderButton" Property="Background" Value="{StaticResource ResourceKey=mouseOverBrush}" />
                                <!--<Setter TargetName="borderButton" Property="BorderBrush" Value="WhiteSmoke" />-->
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="borderButton" Property="Background" Value="{StaticResource ResourceKey=pressedBrush}" />
                                <!--<Setter TargetName="borderButton" Property="BorderBrush" Value="AliceBlue" />-->
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="3*" />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <!--ScrollableWidth：该值表示可滚动的内容元素的水平大小，如果>0，按钮可见，否则不可见-->
        <Button Grid.Row="1" Style="{StaticResource perStyle}" Name="btnLeft" Click="btnLeft_Click" HorizontalAlignment="Center" VerticalAlignment="Center"  Visibility="{Binding ElementName=svContent,Path=ScrollableWidth,Converter={StaticResource doubleToVisibilityConvert}}" Padding="60" Margin="4,5,0,5" />
        <!--<Separator Grid.Column="1" Grid.Row="1">
            <Separator.LayoutTransform>
                <RotateTransform Angle="90" />
            </Separator.LayoutTransform>
        </Separator>-->
        <ScrollViewer Grid.Column="2" Grid.RowSpan="3" Name="svContent" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Hidden" Focusable="False">
            <StackPanel Name="spContent" Orientation="Horizontal" />
        </ScrollViewer>
        <!--<Separator Grid.Column="3" Grid.Row="1">
            <Separator.LayoutTransform>
                <RotateTransform Angle="90" />
            </Separator.LayoutTransform>
        </Separator>-->
        <Button Style="{StaticResource nextStyle}" Grid.Column="4" Grid.Row="1" Name="btnRight" Click="btnRight_Click" Visibility="{Binding ElementName=svContent,Path=ScrollableWidth,Converter={StaticResource doubleToVisibilityConvert}}" Margin="0,5,4,5" />
    </Grid>
</UserControl>
